<template>
  <div class="list-page">
    <tool-bar nav="" title="网关服务路由定义">
      <el-button @click="add_click()">添加</el-button>
    </tool-bar>
    <my-list
        ref="list"
        url="/sys/gateway-route-define/list"
        @param="preload"
        @loaded="procData"
        :page-size="10"
        :store="true"
        :query="query"
    >

      <el-table-column label="name" align="center">
        <template v-slot="scope">
          <div class="link" @click="edit_click(scope.row)">{{ scope.row.name }}</div>
        </template>
      </el-table-column>
      <el-table-column align="center" label="是否阻断" width="120">
        <template v-slot="scope">
          <el-tag v-if="scope.row.isBlock" type="danger" style="font-weight: bold;">阻断</el-tag>
        </template>
      </el-table-column>
      <el-table-column align="center" label="目标服务" width="240">
        <template v-slot="scope">
          <el-tag v-if="!scope.row.isBlock">{{ scope.row.target }}</el-tag>
        </template>
      </el-table-column>
<!--      <el-table-column align="center" label="加密key" width="240" prop="mappingKey">-->
<!--      </el-table-column>-->
      <el-table-column align="center" label="备注" width="240">
        <template v-slot="scope">
          <div v-html="scope.row.remark.slice(0,30)"></div>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center">
        <template v-slot="scope">
          <el-button type="warning" plain round @click="delete_click(scope.row)" size="small">
            删除
          </el-button>
        </template>
      </el-table-column>
      <template #query="scope">
        <kv label="名称">
          <el-input v-model="scope.query.name"></el-input>
        </kv>
      </template>
    </my-list>
  </div>
</template>
<style scoped lang="scss">
</style>
<script setup>
/**
 * Created by CodeGenerator at 2022-07-06 10:21:17
 */


//定义 vue2的this,当前组件
const $self = getCurrentInstance();

//定义 $attrs
const $attrs = useAttrs();


//定义data
const $data = reactive({"query": {}});


const $props = defineProps({});


const list = ref();

//定义事件
const $emit = defineEmits(["update:modelValue", "loaded"]);


const preload = function (param) {
//保存查询条件
//添加查询参数，修改分页参数等。
//param.type = jv.$route.params.type
};
const procData = function (res) {
  res.data.data.forEach(it => {
//如果是组合实体，设置 it.id=...
  });
};
const loadData = function (pageNumber) {
  list.value.loadData(pageNumber);
};
const add_click = function () {
  jv.$router.push("/sys/gateway-route-define/add")
};
const edit_click = function (row) {
//记录上次点击行
  var rowId = row.id;
  list.value.setLastRow(row);
  jv.$router.push("/sys/gateway-route-define/edit/" + rowId)
};
const delete_click = async function (row) {
  var rowId = row.id, rowName = row.name;
  await jv.confirm('确认删除 ' + rowName + ' 吗？');
  var res = await jv.$http.post("/sys/gateway-route-define/delete/" + rowId)
  loadData();
};

onMounted(function () {
//加载存储的查询条件
})


</script>